<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

      <form action="">
          <label for="">用户名</label>
          <input type="text" id='username'>
          <hr>
          <label for="">密码</label>
          <input type="password" id='pwd'>
          <hr>
          <label for="">性别</label>
           <input type="radio" name='gender' value="M">男
           <input type="radio" name='gender' value="F">女
          <hr>
          <label for="">爱好</label>
          <input type="checkbox" name='aihao' value='sport'>运动
          <input type="checkbox" name='aihao' value='movie'>电影
          <input type="checkbox" name='aihao' value='music'>音乐
          <hr>
          <label for="">出生年份</label>
          <select name="" id="birthday">
              <option value="1991">1991</option>
              <option value="1992">1992</option>
              <option value="1993">1993</option>
              <option value="1994">1994</option>
              <option value="1995">1995</option>
              <option value="1996">1996</option>
          </select>
          <hr>
          <label for="">个人评讲</label>
          <textarea name="" id="intro" cols="30" rows="10"></textarea>
          <button type="button">获得表单的值</button>
      </form>
    
</body>
</html>

<script>


/*
   js如何操作表单元素
     1  所有的表单控获取值 都是使用 value的属性

*/
//分别获得表单元素的值
let username = document.getElementById('username').value;
console.log(username);
let pwd = document.getElementById('pwd').value;
console.log(pwd);
//获得单选框
let genderList = document.getElementsByName('gender');
//使用使用循环来获得选中的值
for(let genderObj of genderList){ 
    //判断是否被选中  checked
    if(genderObj.checked){
       console.log(genderObj.value);
    }
   
 }
 //获得复选框的值
 let aihaoList = document.getElementsByName('aihao');
//使用使用循环来获得选中的值
for(let aihaoObj of aihaoList){ 
    //判断是否被选中  checked
    if(aihaoObj.checked){
       console.log(aihaoObj.value);
    }
   
 }
 //获得出生年
 let yearValue = document.getElementById('')


</script>